<div>
	<juci-config-lines>
		<juci-config-line title="{{ 'Hostname' | translate }}">
			<tags-input ng-model="names" display-property="value" key-property="value" 
						placeholder="{{'Add a host' | translate }}" type="url" add-on-space="true"></tags-input>
		</juci-config-line>
		<juci-config-line title="{{ 'Family' | translate }}">
			<juci-select ng-items="ipAddressTypes" ng-model="model.family.value" on-change="onAddressTypeChange($value)"></juci-select>
		</juci-config-line>
		<juci-config-line title="{{ 'IPv4 Address' | translate }}" ng-show="model.family.value == 'ipv4'" error="model.ip.error">
			<juci-input-ipv4-address ng-model="model.ip.value" placeholder="{{placeholder.ipv4}}"></juci-input-ipv4-address>
		</juci-config-line>
		<juci-config-line title="{{ 'IPv6 Address' | translate }}" ng-show="model.family.value == 'ipv6'" error="model.ip.error">
			<div class="{{ model.ip.valid ? '' : 'has-error'}}"><input type="text" class="form-control" ng-model="model.ip.value" placeholder="{{placeholder.ipv6}}"/></div>
		</juci-config-line>
	</juci-config-lines>
</div>
